<template>
  <div class="content-wrapper">
    <div class="fs-24 f-bold f-primary mt-20 mb-30">案例1：中国电信核心去IOE改造</div>
    <div class="flex-row">
      <div class="left-row flex-1 pr-20">
        <div class="section-title flex-row flex-row-center p-20 mb-20">
          <div class="text-center ml-20 mr-40 w100">
            <img src="@/assets/images/icon/ic-case01.png" alt="">
            <div class="fs-20 f-primary f-bold lh-28" >业务挑战</div>
          </div>
          <div class="fs-14 f-normal lh-28 flex-1">
            <div><span class="f-bold">客户名称：</span>{{name}} </div>
            <div><span class="f-bold">上云类型：</span>{{type}}</div>
            <div><span class="f-bold">案例概况：</span>{{survey}}</div>
          </div>
        </div>
        <div class="section-title flex-row flex-row-center p-20 mb-20">
          <div class="text-center ml-20 mr-40 w100">
            <img src="@/assets/images/icon/ic-case02.png" alt="">
            <div class="fs-20 f-primary f-bold lh-28" >解决方案</div>
          </div>
          <div class="fs-14 f-normal lh-28 flex-1">
            <div><span class="f-bold">建设模式：</span>{{plan}}</div>
            <div><span class="f-bold">主要工作内容：</span>{{content}}</div>
          </div>
        </div>
        <div class="box text-center">
          <div class="fs-18 f-bold f-primary mb-20">Oracle 替换为 TeleDB for mysql</div>
          <img :src="img">
        </div>
      </div>
      <div class="left-row flex-1 pl-20">
        <div class="section-title"><svg-icon iconName="biaoti2" class="mr-10"></svg-icon>案例成果</div>
        <div class="box h-box mt-20 mb-20">
          <div class="f-normal fs-14" style="width: 500px">
            {{result}}
            <div class="fs-24 f-primary mt-30">{{resultTitle}}</div>
          </div>
          <img class="bg" src='@/assets/images/case/bg-1.png' />
        </div>
        <div class="section-title "><svg-icon iconName="biaoti2" class="mr-10"></svg-icon>案例价值</div>
        <div class="box h-box mt-20  mb-20">
          <div class="fs-24 f-primary " style="width: 450px">{{worth}}</div>
          <img class="bg" src='@/assets/images/case/bg-2.png' />
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    name: 'index',
    data () {
      return {
        img:require('../../../assets/images/case/pic-1.png'),
        frameworkImg: require('../../../assets/images/case/text1.png'),
        name: '中国电信（CATL）',
        type: '业务系统核心去IOE',
        survey: '在响应中国政府意识到使用美国数据库的巨大安全风险背景下，中国电信使用自主可控的teleDB for mysql全面推进去IOE',
        plan: '调研+自主实施',
        content: '以CRM域、计费账务域核心系统为主，大量使用了oracle复杂的多表关联、多层嵌套特性查询以及独有的数据库对象和存储过程，改造成mysql难度高，工作量巨大。解决方案：中国电信自主可控teleDB for mysql数据库，针对去IOE进行定制开发，形成平台工具能力，帮助用户快速，高质量完成代码改造和数据迁移到mysql。',
        result: '全集团以及31省市核心系统，涵盖B域、M域、O域、大数据域均已成功去O，涉及600+核心系统、服务用户超7亿,稳定运行2年+。',
        resultTitle: '成为全球首家采用自研数据库去O的运营商',
        worth: '运营商核心系统去IOE形成的平台工具能力和平台实施经验，构建成为teleDB数据库生态的核心竞争力。'
      }
    }
  }
</script>

<style scoped lang="scss">
  .content-wrapper:after{
    content: '';
    width: 1920px;
    height: 1080px;
    position: fixed;
    top:0;
    left: 0;
    z-index: -1;
    background: url("~@/assets/images/case/bgline.png") no-repeat bottom;
    background-size: 100%;
  }
  .box{
    padding: 30px 40px;
    background: #101010;
    border: 1px solid rgba(255, 255, 255, 0.2);
    position: relative;
    &.h-box{
      height: 225px;
    }
    .bg{
      position: absolute;
      bottom: 20px;
      right: 20px;
    }
  }
  .lh-28{
    line-height: 28px!important;
  }
  .w100{
    width: 100px;
  }
</style>
